<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"> 
<title>Insert title here</title>
<link  rel="stylesheet" type="text/css"  href="/resource/plugs/bootstrap/dist/css/bootstrap.min.css"/> 
<link  rel="stylesheet" type="text/css"  href="/resource/plugs/bootstrap-select/bootstrap-select.min.css" />
<link  rel="stylesheet" type="text/css"  href="/resource/plugs/bootstrap-form/bootstrap-form.css"/>
<link  rel="stylesheet" type="text/css"  href="/resource/plugs/bootstrap-table/bootstrap-table.min.css"/> 
<link  rel="stylesheet" type="text/css"  href="/resource/plugs/bootstrap3-editable/css/bootstrap-editable.css"/> 
<link  rel="stylesheet" type="text/css"  href="/resource/plugs/validate/easy-validate.css" />
<style type="text/css">
.bootstrap-table{
 margin-top: 20px;
}
.fixed-table-pagination{
 display: none !important;
}
</style>
</head> 
<script type="text/javascript" src="/resource/js/common/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="/resource/js/common/url.js"></script>
<script type="text/javascript" src="/resource/js/common/framework-ajax.js"></script> 
<script type="text/javascript" src="/resource/js/common/dictionary-util.js"></script>
<script type="text/javascript" src="/resource/plugs/date/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="/resource/plugs/date/dateformat.js"></script>
<script type="text/javascript" src="/resource/plugs/validate/easy-validate.js"></script>
<script type="text/javascript" src="/resource/plugs/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/resource/plugs/bootstrap-select/bootstrap-select.min.js"></script>  
<script type="text/javascript" src="/resource/plugs/bootstrap-form/bootstrap-form.js"></script>  
<script type="text/javascript" src="/resource/plugs/bootstrap3-editable/js/bootstrap-editable.min.js"></script>
<script type="text/javascript" src="/resource/plugs/bootstrap-table/bootstrap-table.min.js"></script>
<script type="text/javascript" src="/resource/plugs/bootstrap-table/bootstrap-table-zh-CN.js"></script>
<script type="text/javascript" src="/resource/plugs/bootstrap3-editable/extensions/bootstrap-table-editable.min.js"></script>
<script type="text/javascript" src="/resource/js/common/uuid-util.js"></script>
<script type="text/javascript" src="/resource/js/business/autogrid/autoBootstrapGridConfig.js"></script>
<script type="text/javascript">
$(function(){
	$("#add").on("click",function(){
	 var row = 
	    {   id:"",
			uniqueId:UUID(),
			tableColumn:"",
			columnAlias:"",
			tableName :"",
			name:"",
    		elementType: "text",
    		isDisplay : 0,
    		align    : 2,
    		sort : 1,
    		sqlSort : 0,
    		webSort :0,
    		isFixedQuery :0,
    		isDepthQuery : 0,
    		width :"",
    		dictCode:"",
    		formatter :"",
    		displaySort: "", 
		}
		$("#autoGridConfig").bootstrapTable("insertRow",{index:0,row:row});	
	})  
	
	$("#remove").on("click",function(){
		var data = $("#autoGridConfig").bootstrapTable("getSelections");
		if(data){
			for(var i = 0,len = data.length ; i < len ; i++){
				$("#autoGridConfig").bootstrapTable("removeByUniqueId",data[i].uniqueId); 
			}
		}
	})  	
})

</script>
 
<body>  
	<form id='autoFormConfig'></form>  
	
	<form id="quickResourceForm"></form>
	
    <div id="auto_operation" style="margin-top:15px">
	  <button id="add" type="button"  class="btn btn-primary auto-grid-button"><span class="glyphicon glyphicon-plus" aria-hidden="true">添加行</span></button>
	  <button id="remove" type="button"  class="btn btn-primary auto-grid-button"><span class="glyphicon glyphicon-remove" aria-hidden="true">删除行</span></button>
	  <button id="analysisSql" type="button"  class="btn btn-primary auto-grid-button"><span class="glyphicon glyphicon-wrench" aria-hidden="true">解析</span></button>
	  <button id="saveAutoGridConfig" type="button"  class="btn btn-primary auto-grid-button"><span class="glyphicon glyphicon-saved" aria-hidden="true">保存</span></button>
	</div>  
	
    <table id="autoGridConfig" class="auto-grid-config"></table>   
</body> 
<script type="text/javascript"> 
$.fn.editable.defaults.emptytext = "&nbsp;&nbsp;&nbsp;";
</script>

</html> 